/*
 * ==============================生成报表==============================
 * target: 生成图表的目标容器(dom对象,用jquery获取的对象需要转成dom对象);
 * color: 色系
 * */
var custom_color = ['#4fa8f9', '#6ec71e', '#f56e6a', '#fc8b40', '#818af8', '#31c9d7', '#f35e7a', '#ab7aee', '#14d68b', '#edb00d'];

var toDoubleLine = function (target, data) {
    /*if(target != null && target != "" && target != undefined){
        target.dispose();
    }*/
    var targetObj = echarts.init(target);
    var option = {

        color: ['#28BBF4', '#F89B73', '#7778EF', '#69C8C7'], //修改曲线颜色

        title: {
            x: 'center', //标题居中
            text: data.title,
            padding: 20,
            textStyle: {
                color: '#29cbf1',
                fontSize: 13
            }
        },

        tooltip: {
            trigger: 'item',
            showDelay: 0,
            axisPointer: {
                show: true,
                type: 'cross',
                lineStyle: {
                    type: 'dashed',
                    width: 1
                }
            },
            formatter: function (params) {
                var relVal = params.name;
                if (params.seriesName == '同比' || params.seriesName == '累计同比') {
                    relVal += '<br/>' + params.marker + params.seriesName + ' : ' + params.value + '%'
                } else {
                    relVal += '<br/>' + params.marker + params.seriesName + ' : ' + params.value;
                }
                return relVal;
            }

        },

        legend: {
            y: 'bottom', //图例说明(属性)在底部显示，不写默认在顶部显示
            type: 'scroll', //图例说明(属性)过多时，设置为scroll，加上滚动翻页
            data: ['开工面积','同比'], //属性类别
            textStyle: {
                color: '#29cbf1'
            }
            //selectedMode:'multiple', //选中模式
            // selectedMode: true/single/multiple, // 选中模式
            /*selected:{ //初始默认后面一条数据不显示
                '压力':false
            }*/
        },

        /*toolbox: {

            show : true,

            orient: 'vertical',

            left: 'right',

            top: 'center',

            feature : {

                mark : {show: true},

                dataZoom : {show: true},

                dataView : {show: true},

                magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},

                restore : {show: true},

                saveAsImage : {show: true}

            }

        },*/

        grid: {
            top: '8%',
            left: '8%', //y轴离左侧边框边距
            right: '6%', //y轴离右侧边框边距
            bottom: '12%', //x轴离底部边框边距
            containLabel: true
        },

        calculable: true,

        /*dataZoom : {
            show : true,
            realtime : true,
            type: 'slider', // slider表示有滑动块的，inside表示内置的
            bottom:"5%",
            start: 20, // 初始x轴位置在最右边
            end: 60, // 初始x轴位置在最右边
            borderColor:"transparent", // 滚动条边框颜色
            height: 20
        },
*/
        xAxis: [{
                type: 'category',
                splitLine: {
                    show: false
                },
                boundaryGap: true,
                data: data.month,
                axisLabel: {
                    //interval:0,
                    textStyle: {
                        color: '#29cbf1'
                    }
                }
            }

        ],

        yAxis: [{
                type: 'value',
                splitLine: {
                    show: false
                },
                //默认以千分位显示，不想用的可以在这加一段
                axisLabel: { //调整左侧Y轴刻度， 直接按对应数据显示
                    show: true,
                    textStyle: {
                        color: '#29cbf1'
                    },
                    showMinLabel: true,
                    showMaxLabel: true,
                    formatter: function (value) {

                        return value;

                    }

                }

            },

            {
                type: 'value',
                splitLine: {
                    show: false
                },
                //默认以千分位显示，不想用的可以在这加一段
                axisLabel: { //调整左侧Y轴刻度， 直接按对应数据显示
                    show: true,
                    textStyle: {
                        color: '#29cbf1'
                    },
                    showMinLabel: true,
                    showMaxLabel: true,
                    formatter: function (value) {

                        return value;

                    }

                }

            }

        ],

        series: [{
                name:"开工面积",
                type: 'line',
                smooth: false,
                yAxisIndex: 0, //属性，归属左侧y轴
                data: data.areaTotalArr
            },

            {
                name: "同比",
                type: 'line',
                smooth: false,
                yAxisIndex: 1, //属性，归属右侧y轴
                data: data.areaTotalCompareArr
            }

        ]

    };

    //指定图表的配置项和数据
    targetObj.setOption(option);
    window.addEventListener("resize", function () {
        targetObj.resize();
    });
};

var toDoubleLine1 = function (target, data,legend) {
    /*if(target != null && target != "" && target != undefined){
        target.dispose();
    }*/
    var targetObj = echarts.init(target);
    var option = {

        color: ['#28BBF4', '#F89B73', '#7778EF', '#69C8C7'], //修改曲线颜色

        title: {
            x: 'center', //标题居中
            text: data.title,
            padding: 20,
            textStyle: {
                color: '#29cbf1',
                fontSize: 13
            }
        },

        tooltip: {
            trigger: 'item',
            showDelay: 0,
            axisPointer: {
                show: true,
                type: 'cross',
                lineStyle: {
                    type: 'dashed',
                    width: 1
                }
            },
            formatter: function (params) {
                var relVal = params.name;
                if (params.seriesName == '同比' || params.seriesName == '累计同比') {
                    relVal += '<br/>' + params.marker + params.seriesName + ' : ' + params.value + '%'
                } else {
                    relVal += '<br/>' + params.marker + params.seriesName + ' : ' + params.value;
                }
                return relVal;
            }

        },

        legend: {
            y: 'bottom', //图例说明(属性)在底部显示，不写默认在顶部显示
            type: 'scroll', //图例说明(属性)过多时，设置为scroll，加上滚动翻页
            data: legend, //属性类别
            textStyle: {
                color: '#29cbf1'
            }
            //selectedMode:'multiple', //选中模式
            // selectedMode: true/single/multiple, // 选中模式
            /*selected:{ //初始默认后面一条数据不显示
                '压力':false
            }*/
        },

        /*toolbox: {

            show : true,

            orient: 'vertical',

            left: 'right',

            top: 'center',

            feature : {

                mark : {show: true},

                dataZoom : {show: true},

                dataView : {show: true},

                magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},

                restore : {show: true},

                saveAsImage : {show: true}

            }

        },*/

        grid: {
            top: '8%',
            left: '8%', //y轴离左侧边框边距
            right: '6%', //y轴离右侧边框边距
            bottom: '12%', //x轴离底部边框边距
            containLabel: true
        },

        calculable: true,

        /*dataZoom : {
            show : true,
            realtime : true,
            type: 'slider', // slider表示有滑动块的，inside表示内置的
            bottom:"5%",
            start: 20, // 初始x轴位置在最右边
            end: 60, // 初始x轴位置在最右边
            borderColor:"transparent", // 滚动条边框颜色
            height: 20
        },
*/
        xAxis: [{
                type: 'category',
                splitLine: {
                    show: false
                },
                boundaryGap: true,
                data: data.month,
                axisLabel: {
                    //interval:0,
                    textStyle: {
                        color: '#29cbf1'
                    }
                }
            }

        ],

        yAxis: [{
                type: 'value',
                splitLine: {
                    show: false
                },
                //默认以千分位显示，不想用的可以在这加一段
                axisLabel: { //调整左侧Y轴刻度， 直接按对应数据显示
                    show: true,
                    textStyle: {
                        color: '#29cbf1'
                    },
                    showMinLabel: true,
                    showMaxLabel: true,
                    formatter: function (value) {

                        return value;

                    }

                }

            },

            {
                type: 'value',
                splitLine: {
                    show: false
                },
                //默认以千分位显示，不想用的可以在这加一段
                axisLabel: { //调整左侧Y轴刻度， 直接按对应数据显示
                    show: true,
                    textStyle: {
                        color: '#29cbf1'
                    },
                    showMinLabel: true,
                    showMaxLabel: true,
                    formatter: function (value) {

                        return value;

                    }

                }

            }

        ],

        series: [{
                name:legend[0],
                type: 'line',
                smooth: false,
                yAxisIndex: 0, //属性，归属左侧y轴
                data: data.numTotalArr
            },

            {
                name: legend[1],
                type: 'line',
                smooth: false,
                yAxisIndex: 1, //属性，归属右侧y轴
                data: data.numTotalCompareArr
            }

        ]

    };

    //指定图表的配置项和数据
    targetObj.setOption(option);
    window.addEventListener("resize", function () {
        targetObj.resize();
    });
};

/*
 * 饼图
 * target: 生成图表的目标容器(dom对象);
 * data: 数据
 * @time 2020 - 01 - 02
 * */
var toChartPie = function (target, data,data2) {
    // var titleText = data.innerShow.name || '';
    // var subText = data.innerShow.value || '';
    //每8字符换行
    var addLine = function (params) {
        var strs = params.split(''); //字符串数组
        var str = ''
        for (var i = 0, s; s = strs[i++];) {
            str += s;
            if (!(i % 8)) str += '\n'; //8个字符一行
        }
        return str;
    }
    // titleText = addLine(titleText);

    var targetObj = echarts.init(target);
    var option = {
        color: ['#00b8fe', '#c889f7', '#f6f886', '#14d29d', '#4AACC5', '#F79645', '#c23531', '#2f4554', '#61a0a8', '#d48265', '#91c7ae', '#749f83'],
        // backgroundColor: 'rgba(0,0,0,0)',
        legend: {
            // type: 'scroll',
            // orient: 'vertical',
            // x: 'right',
            // y: 'center',
            // padding: 40,
            // margin: 20,
            bottom: 15,
            left: 'center',
            textStyle: {
                color: '#fff',
                fontSize: 12,
            },
            // icon: 'circle',
            data: data
        },
        title: {
            // text: titleText,
            // subtext: subText,
            left: 'center',
            top: '30%',
            textStyle: {
                color: '#00fbff',
                fontSize: 20,
                fontFamily: 'Arial'

            },
            subtextStyle: {
                color: '#00fbff',
                fontSize: 18,
                fontFamily: 'Arial'
            },
            x: '50%',
            y: '25%',
            textAlign: 'center'
        },
        tooltip: {
            trigger: 'item',
            //formatter: "{a} <br/>{b}: {c} ({d}%)"
            formatter: "{b}:{c}"
        },
        series: [{
            name: '访问来源',
            type: 'pie',
            radius: ['50%', '70%'],
            center: ['50%', '40%'],
            avoidLabelOverlap: false,
            selectedMode: false,
            label: {
                normal: {
                    show: false,
                    position: 'inner',
                    formatter: '{d}%',
                    textStyle: {
                        color: '#fff',
                        fontWeight: 'bold',
                        fontSize: 14
                    }
                }
            },
            labelLine: {
                normal: {
                    show: false
                }
            },
            data: data2
        }]
    };
    //指定图表的配置项和数据
    targetObj.setOption(option);
    window.addEventListener("resize", function () {
        targetObj.resize();
    });

};

/*
 * 柱状图
 * target: 生成图表的目标容器(dom对象);
 * data: 数据
 * @time 2020-01-05
 * */
var toChartBar = function (target, data) {
    var targetObj = echarts.init(target);
    var option = {
        grid: {
            top: '3%',
            left: '3%',
            right: '8%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: {
            type: 'value',
            boundaryGap: [0, 0.1],
            axisLabel: {
                show: true,
                textStyle: {
                    color: "#fff"
                }
            }
        },
        yAxis: {
            splitLine: { //去掉网格线
                show: false
            },
            type: 'category',
            data: data.y,
            axisLabel: {
                show: true,
                textStyle: {
                    color: "#fff"
                }
            }
        },
        tooltip: {
            show: true,
            formatter: '{b}: {c0}个'
        },
        series: [{
            type: 'bar',
            barGap: '80%',
            /*多个并排柱子设置柱子之间的间距*/
            barCategoryGap: '50%',
            data: data.x,
            itemStyle: {
                normal: {
                    color: 'rgb(252, 205, 137)'
                }
            }
        }]
    };
    //指定图表的配置项和数据
    targetObj.setOption(option);
    window.addEventListener("resize", function () {
        targetObj.resize();
    });
};

/*
 * 开工数量对比图 和 投资金额对比图
 * target: 生成图表的目标容器(dom对象);
 * data: 数据
 * @time 2019-12-31
 * */
var toChartCountBar = function (legendata,target,data,name) {
    var targetObj = echarts.init(target);
    var option = {
        legend: {
            //y: 'bottom', //图例说明(属性)在底部显示，不写默认在顶部显示
            bottom: '3%',
            type: 'scroll', //图例说明(属性)过多时，设置为scroll，加上滚动翻页
            data: legendata, //属性类别
            textStyle: {
                color: '#29cbf1'
            }
        },
        grid: {
            top: '9%',
            left: '3%',
            right: '3%',
            bottom: '10%',
            containLabel: true
        },
        xAxis: {
            splitLine: { //去掉网格线
                show: false
            },
            type: 'category',
            data:data.projectCityArr ,
            // axisLabel: {
            //     show: true,
            //     textStyle: {
            //         color: "#fff"
            //     }
            // },
            axisLabel: {
                interval: '0',
                show: true,
                textStyle: {
                    color: "#29cbf1"
                }
            }
        },
        yAxis: {
            splitLine: { //去掉网格线
                show: true,
                lineStyle: {
                    color: "#303389"
                }
            },
            type: 'value',
            name: name,
            nameTextStyle: {
                color: "rgb(173, 194, 255)"
            },
            boundaryGap: [0, 0.1],
            axisLabel: {
                show: true,
                textStyle: {
                    color: "#fff"
                }
            }
        },
        series: [{
            name: legendata[0],
            type: 'bar',
            // barGap: '80%',
            /*多个并排柱子设置柱子之间的间距*/
            // barCategoryGap: '50%',
            data: data.numTotalLastArr,
            itemStyle: {
                normal: {
                    color: 'rgb(79, 129, 190)'
                }
            },
            label: {
                normal: {
                    show: true,
                    position: 'top',
                    color: 'rgb(173, 194, 255)'
                }
            }
        }, {
            name: legendata[1],
            type: 'bar',
            // barGap: '80%',
            /*多个并排柱子设置柱子之间的间距*/
            // barCategoryGap: '50%',
            data: data.numTotalNowArr,
            itemStyle: {
                normal: {
                    color: 'rgb(192, 80, 78)'
                }
            },
            label: {
                normal: {
                    show: true,
                    position: 'top',
                    color: 'rgb(173, 194, 255)'
                }
            }
        }]
    };
    //指定图表的配置项和数据
    targetObj.setOption(option);
    window.addEventListener("resize", function () {
        targetObj.resize();
    });
};
/*
 * 地图热力图（连续型-均价、面积）
 * title: 标题
 * type: 类型（1-均价；0-面积）
 * target: 生成图表的目标容器(dom对象);
 * cityName 该城市的名称
 * cityUrl 该城市的行政区划json数据url
 * rangeObj 图例范围对象
 * monthArr 月份（01-12）
 * dataMap 数据
 * @time 2020-01-02
 * */
var toCharMap2 = function (type, target, cityName, cityUrl, rangeObj, monthArr, dataMap, types, startyear, endyear) {
    // 初始化dom容器
    var myChart = echarts.init(target);
    var option = null;
    myChart.showLoading();

    // 获取geojson
    $.get(cityUrl, function (geoJson) {
        myChart.hideLoading();
        echarts.registerMap(cityName, geoJson);
        // option参数设置
        option = {
            baseOption: {
                //时间线
                /*timeline: {
                    axisType: 'category',
                    data: monthArr, //月份
                    currentIndex: monthArr.length - 1,
                    playInterval: 2000,
                    loop: true,
                    autoPlay: true,
                    bottom: "2%",
                    symbolSize: 18,
                    lineStyle: {
                        color: '#262f62',
                        width: 8
                    },
                    controlStyle: {
                        showPlayBtn: true,
                        showPrevBtn: false,
                        showNextBtn: false,
                        itemSize: 25,
                        itemGap: 40,
                        color: '#fa9022',
                        borderColor: '#fff',
                        borderWidth: 2
                    },
                    checkpointStyle: {
                        color: '#fa9022',
                        symbolSize: 18,
                        borderColor: '#fff',
                        borderWidth: 2
                    },
                    emphasis: {
                        controlStyle: {
                            color: '#fa9022',
                            borderColor: '#fff',
                            borderWidth: 2
                        },
                    },
                    label: {
                        normal: {
                            show: true,
                            textStyle: {
                                fontSize: '14',
                                color: '#fff'
                            }
                        },
                        emphasis: {
                            textStyle: {
                                fontSize: '18',
                                color: '#fa9022'
                            }
                        }
                    },
                },*/
                tooltip: {
                    trigger: 'item'
                },
                visualMap: {
                    //连续型
                   min: rangeObj.min,
                    max: rangeObj.max,
                    left: '5%',
                    bottom: '18%',
                    text: ['高', '低'],
                    calculable: true,
                    itemWidth: 20,
                    seriesIndex: [1],
                    inRange: {
                        // color: ['#1e85f9','#3f98fc', '#3fabfc', '#6fbffc', '#addafc', '#cdf4ff']
                        color: ['#cdf4ff', '#addafc', '#6fbffc', '#3fabfc', '#3f98fc', '#1e85f9']
                    },
                    textStyle: {
                        fontSize: '12',
                        color: '#fff'
                    }
                },
                roamController: {
                    show: true,
                    x: 'right',
                    mapTypeControl: {
                        'china': true
                    }
                },
                geo: {
                    show: true,
                    zoom: 1.2,
                    map: 'hainan',
                    center: [109.844902, 19.0392],
                    layoutCenter: ['50%', '50%'], //地图大小比例
                    layoutSize: '100%',
                    label: {
                        normal: {
                            show: true,
                        },
                        emphasis: {
                            show: false,
                        }
                    },
                    roam: true,
                    itemStyle: {
                        normal: {
                            areaColor: '#767fa6',
                            borderColor: '#182147', //边框颜色,边界线
                        },
                        emphasis: {
                            borderWidth: 1,
                            borderColor: '#182147',
                            areaColor: '#f4eebc', //鼠标hover市县高亮颜色
                        }
                    }
                },
                series: [{
                        // 市县名称
                        type: 'scatter',
                        coordinateSystem: 'geo',
                        data: dataMap,
                        symbolSize: 0.1,
                        label: {
                            normal: {
                                show: true,
                                formatter: '{b}',
                                position: 'right',
                                show: true,
                                textStyle: {
                                    fontSize: 12,
                                },
                            },
                            emphasis: {
                                show: true
                            }
                        },
                        itemStyle: {
                            normal: {
                                color: '#000', //省份文字颜色
                            },
                        }
                    },
                    {
                        name: types,
                        type: 'map',
                        map: 'hainan',
                        geoIndex: 0,
                        aspectScale: 0.75, //长宽比
                        showLegendSymbol: false, // 存在legend时显示
                        //地图文字设置
                        label: {
                            normal: {
                                show: true
                            },
                            emphasis: {
                                show: false,
                                textStyle: {
                                    color: '#000'
                                }

                            }
                        },
                        itemStyle: {
                            normal: {
                                areaColor: '#031525',
                                borderColor: '#3B5077',
                            },
                            emphasis: {
                                areaColor: '#AA91B7'
                            }
                        },
                        animation: false,
                        data: dataMap
                    },
                    {
                        name: '点',
                        type: 'scatter',
                        coordinateSystem: 'geo',
                        symbol: 'pin',
                        symbolSize: 0.1,
                        label: {
                            normal: {
                                show: true,
                                textStyle: {
                                    color: '#000', //数字颜色
                                    fontSize: 20,
                                },
                                offset: [10, 35]
                            }
                        },
                        itemStyle: {
                            normal: {
                                color: '#F62157', //标志颜色
                            }
                        },
                        zlevel: 6,
                        data: dataMap
                    }
                ]
            }
        };
        myChart.setOption(option, true);
        window.addEventListener("resize", function () {
            myChart.resize();
        });
    })
};    
    /*
     * 地图热力图（连续型-均价、面积）
     * title: 标题
     * type: 类型（1-均价；0-面积）
     * target: 生成图表的目标容器(dom对象);
     * cityName 该城市的名称
     * cityUrl 该城市的行政区划json数据url
     * rangeObj 图例范围对象
     * monthArr 月份（01-12）
     * dataMap 数据
     * @time 2020-01-02
     * */
var toCharMap = function (type, target, cityName, cityUrl, rangeObj, monthArr, dataMap, types, startyear, endyear) {
    // 初始化dom容器
    var myChart = echarts.init(target);
    var option = null;
    myChart.showLoading();
    // 获取geojson
    $.get(cityUrl, function (geoJson) {
        myChart.hideLoading();
        echarts.registerMap(cityName, geoJson);
        // option参数设置
        option = {
            dataRange: {
                min: 0, //颜色区间的最小值
                max: 50, //颜色区间的最大值，和data中的最大值一致
                x: 'left',
                y: 'bottom',
                text: ['高', '低'], // 文本，默认为数值文本
                calculable: true,
                inRange: {
                    //颜色区间
                    // color: ['lightskyblue','yellow', 'orangered','red']
                    color: ['#cdf4ff', '#addafc', '#6fbffc', '#3fabfc', '#3f98fc', '#1e85f9']
                },
                textStyle: {
                    fontSize: '12',
                    color: '#fff'
                }
            },
            tooltip: {
                show: true,
                formatter: types + '<br/> {b}: {c0}'
            },
            series: [{
                type: 'map',
                map: 'demo',
                itemStyle: {
                    normal: {
                        label: {
                            show: true
                        }
                    },
                    emphasis: {
                        label: {
                            show: true
                        }
                    }
                },
                data:dataMap
            }]
        };
        myChart.setOption(option, true);
        window.addEventListener("resize", function () {
            myChart.resize();
        });
    })   
}
